<template>
  <div id="introduct">
      <div id="description">
        <div class="new-content-title-wrapper">
          <div class="new-content-title">{{title}}</div>
          <div class="new-content-line"></div>
        </div>
        <div class="m-manager-table news-list-common">
          <div class="m-manager-table__title" style="display: none;"></div>
          <a-row v-show="xzqh_s_show">
            <!-- :onlycity="onlycity" -->
            <xzqh_s :vertical="vertical"  needyear="false"></xzqh_s>
            <el-date-picker v-model="theYear" type="year" placeholder="选择年" value-format="yyyy" @change="Yearchange"></el-date-picker>
          </a-row>
          <a-table :data-source="data"
            class="m-manager-table__table m-manager-table__hover--none m-manager-table__choose--none" size="small"
            :showHeader="false" :loading="loading" tableLayout="auto" 
            :pagination="false"
            :customRow="rowClick"
            >
            <a-table-column-group>
            </a-table-column-group>
            <a-table-column>
              <template slot-scope="text, record">
                <span class="ant-table-row-indent indent-level-0" style="padding-left: 0px;"></span>
                <div class="news-list-common-row">
                  <div class="news-list-common__title__wrapper">
                    <span class="news-list-common__circle"></span>
                    <span :class="['news-list-common__title',title_class(record)]">{{ record.title}}</span>
                  </div>
                  <div class="new-list-common__time">{{ record.publicTime}}</div>
                </div>
              </template>
            </a-table-column>
          </a-table>
          <div class="m-manager-table__pagination" >
            <a-pagination 
            :default-current="1" 
            :current="currentPage"
            :total="totalItems" 
            :show-total="showtotal"
            :showLessItems="true"
            size="small"
            @change="change_page_number"
            />


          </div>
        </div>
      </div>
    </div>
</template>
<script>
  import $ from 'jquery';
  import Bus from '../../src/bus.js';
  import xzqh_s from '@/components/map/xzqh_select.vue';
  export default {
    components: {

    },
    data() {
      return {
        title:'',
        loading: false,
        data: [],
       
        rowClick: record => ({
          on: {
            click: () => {
              this.click(record);
            }
          }
        }),
        newsType:-1,
        totalItems:0,
        currentPage:1,


        init:false,

        vertical:'vertical',
        onlycity:'onlycity',
        xzqh_s_show:false,
        regionid:150000000,
        theYear:''
        
      }
    },
    mounted() {
      let path=this.GetLastRoute(this.$route.path,1);
      if(path=="notic"){
        this.newsType=0
        this.title='政策信息'
      }
      else if(path=="trend"){
        this.newsType=1
        this.title='工作动态'
      }
      else if(path=="media"){
        this.newsType=5
        this.title='基层信息'
      }
      else if(path=="change"){
        this.newsType=10
        this.title='行政区划变更'
      }
      if(this.newsType>=0){
        this.fetchnews(1);
      }
      Bus.$on('regionid_change', (regionid,level) => {
        if(this.regionid ==regionid){

        }
        else{
          this.regionid=regionid
          this.fetchnews(1);
        }
        
        
      }) 
      Bus.$on('newsType_change', (item) => {
        if(this.newsType==item.type){

        }
        else{
         
          this.newsType=item.type;
          this.title=item.title
          this.ChangenewsType();
          
          this.fetchnews(1);
        }
      })
      this.ChangenewsType();
    },
    computed:{
      
    },
    components: {
      xzqh_s,
    },
    methods: {
      Yearchange(Year){
        this.fetchnews(1);
      },
      ChangenewsType(){
        if(this.title=='行政区划变更'){
          this.xzqh_s_show=true
        }
        else{
          this.xzqh_s_show=false
        }
      },
      title_class(record){
        if(record.markertype==''){
          return ''
        }
        if(record.markertype=='txt'){
          return 'news-list-common__txt'
        }
        else if(record.markertype=='video'){
          return 'news-list-common__video'
        }
        else{
          return ''
        }
      },
      showtotal(total, range){
        return `共 ${this.totalItems} 个，当前${range[0]}-${range[1]}`
      },
      click(record){
        this.$router.push({
          path: `/platform/newsList/notic/detail/${record.id}`,
        })
      },
      change_page_number(page, pageSize){
        this.currentPage=page
            // this.search_content(page);
        this.fetchnews(page);
      },
      update_pageInfo(pageInfo){
        this.totalItems=pageInfo.total;
      },
      update_data(data){
        let dataNew=[];
        data.forEach((element,index) => {
          dataNew.push({
            title:element.title,
            id:element._id,
            publicTime: new Date(element.time).format("yyyy-MM-dd"),
            markertype:element.havevideo?'video':'txt',//'' 'txt' 'video' havevedio
            key:index
          })
        });
        this.data=dataNew;
      },
      fetchnews(pageNum) {
        this.currentPage=pageNum;
        this.loading = true;
        let that=this;
        let newsType=this.newsType==0?'政策信息':this.newsType==1?'工作动态':this.newsType==5?'基层信息':'行政区划变更'
        let data={
          type:newsType,
          pageSize:10,
          pageNum:pageNum,
        }
        if(this.title=='行政区划变更' && this.regionid !=150000){
          data.province=this.regionid
        }
        if(this.theYear>0){
          data.year=this.theYear
          data.yearbefore=true
        }
        let ajaxSet={
          type:"post",
          async:true,
          dataType:"json",
          url:window.Glod.ajax+'xzqh/search_news?',
          data:data
        }
        $.ajax(ajaxSet)
        .then(databack=>{
          that.loading=false
           if(databack.status==true){
              that.update_pageInfo(databack.result.pageInfo);
              that.update_data(databack.result.data);
           }
           else{
             that.loading=false
           }
          },error=>{
            that.loading=false
            }
        );
      },
    }
  }
</script>